<template>
	<view class="sysUpdata" v-if="showUpdata" @touchmove.stop.prevent="moveHandleStop">
		<view class="toast">
			<view class="main_sysTeam">
				<view class="main_sysTeam_item">
					<view class="top">发现新版本</view>
					<view class="version">{{updata.version}}</view>
					<view class="updata_content">
						<text class="updata_top">更新内容:</text>
						<view class="updata_contet_item">
							<scroll-view style="height: 300rpx;" :scroll-y="true" :show-scrollbar="true">
								<view class="content_style" v-html="updata.content"></view>
							</scroll-view>
						</view>
					</view>
					<block v-if="!downLoading">
						<view @click="hotUpdata" v-if="updata.appUpdateType == '10012001'" class="updata_btn">立即更新</view>
						<view @click="downUpdata" v-else-if="updata.appUpdateType == '10012002'" class="updata_btn">立即下载</view>
						<view @click="jumpAppStore" v-else class="updata_btn">去App Store更新</view>
					</block>
					<block v-else>
						<view class="downloads">
							<view class="task_links">
								<view class="shows" :style="{width:progress+'%'}"></view>
							</view>
							<view>{{progress < 100 ? '下载中'+progress+'%' : '下载完成，重启中...'}}</view>
						</view>
					</block>
				</view>
				<image v-if="progress <= 0 && ifMuset" @click="showUpdata = false" class="close_mask" src="/static/ico/close.png"></image>
			</view>
			<view class="mask"></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				showUpdata:false,
				updata:{
					phone:'',
					version:'V2.0.3',
					content:'',
					appUpdateType:'',
					updataUrlLink:'',
					downUrl:'',
					appStroe:'itms-apps://itunes.apple.com/cn/app/id1513082715?mt=8'
				},
				downLoading:false,
				progress:0,
				ifMuset:false, //是否强制更新
			};
		},
		methods:{
			//禁止滚动
			moveHandleStop(){
				
			},
			//检查版本
			checkVersion(){
				const _this = this;
				plus.runtime.getProperty(plus.runtime.appid,async function(info){
					let v = info.version;
					let app = plus.os.name;
					if(app == 'Android'){
						let res = (await _this.$http('/api/unAuth/android/update/v'+v,'get',{})).data;
						if(res && res.code == '0'){
							_this.showUpdata = true;
							//_this.showModel(res,app);
							_this.updata = {
								phone:'Android',
								version:res.data.versionId,
								content:res.data.versionContent,
								appUpdateType:res.data.appUpdateType,
								updataUrlLink:res.data.androidUpdateUrl || '',
								downUrl:res.data.androidUrl || ''
							};
						}
					}else{
						let res = (await _this.$http('/api/unAuth/ios/update/v'+v,'get',{})).data;
						if(res && res.code == '0'){
							_this.showUpdata = true;
							//_this.showModel(res,app);
							_this.updata = {
								phone:'IOS',
								version:res.data.versionId,
								content:res.data.versionContent,
								appUpdateType:res.data.appUpdateType,
								updataUrlLink:res.data.iosUpdateUrl || '',
								downUrl:res.data.iosLinkUrl || '',
								appStroe:'itms-apps://itunes.apple.com/cn/app/id1513082715?mt=8'
							};
						}
						
					}
				})
			},
			//热更新
			hotUpdata(){
				const _this = this;
				_this.downLoading = true;
				let downloadTask = uni.downloadFile({
					url: this.updata.updataUrlLink,
					success: (downloadResult) => {  
						if (downloadResult.statusCode === 200) {  
							plus.runtime.install(downloadResult.tempFilePath, {  
								force: false  
							}, function() {  
								//更新成功后清除缓存
								//uni.clearStorageSync();
								_this.$clearLocal();
								uni.removeStorageSync('newGuide');
								setTimeout(()=>{
									plus.runtime.restart(); 
								},1000);
								uni.hideLoading();
							}, function(e) {  
								uni.showToast({
									title:'更新失败，请重新尝试！',
									icon:'none',
									duration:500
								});
								setTimeout(()=>{
									plus.runtime.restart(); 
								},600);
								uni.hideLoading();
							});  
						}  
					},
					fail:(e)=>{
						uni.showToast({
							title:'下载失败',
							icon:'none',
							duration:500
						});
					}
				});  
				downloadTask.onProgressUpdate((res)=>{
					_this.progress = res.progress;
				});
			},
			//强制版本下载更新
			downUpdata(){
				plus.runtime.openURL(this.updata.downUrl);
			},
			//跳转App Store
			jumpAppStore(){
				plus.runtime.launchApplication({
					action: 'itms-apps://itunes.apple.com/cn/app/id1513082715?mt=8'
				})
			}
		},
		mounted() {
			//检查更新
			//关闭检查更新
			this.checkVersion();
		},
		watch:{
			showUpdata:{
				handler(val){
					if(val){
						uni.hideTabBar({})
					}else{
						uni.showTabBar({});
					}
				},
				immediate:true
			}
		}
	}
</script>

<style lang="scss">
	.sysUpdata{
		@include flex_center;
		.toast{
			z-index: 1100;
			.mask{
				opacity: 0.4;
			}
		}
		.main_sysTeam{
			@include flex_cloumn_center;
			position: relative;
			width: 550rpx;
			height: 1000rpx;
			background: url(../../static/modifyimg/updata.png) no-repeat center;
			background-size: 550rpx 1000rpx;
			.close_mask{
				width: 80rpx;height: 80rpx;
				position: absolute;
				bottom: -100rpx;
			}
			.main_sysTeam_item{
				width: calc(100% - 72rpx);
				padding:170rpx 36rpx 36rpx;
				.top{
					color: #DF3428;
					font-size: 48rpx;
					font-weight: bold;
				}
				.version{
					display: inline-block;
					font-size: 30rpx;
					color: #fff;
					background-color: #DF3428;
					border-radius: 22rpx;
					padding:0rpx 25rpx;
					margin-left: 120rpx;
					margin-top: 16rpx;
				}
				.updata_content{
					margin-top: 160rpx;
					font-size: 30rpx;
					.updata_top{
						font-weight: bold;
					}
					.updata_contet_item{
						color: #666;
						padding:20rpx 0;
						line-height: 60rpx;
						height: 300rpx;
						overflow-y: scroll;
						.content_style{
							white-space: pre-wrap;
						}
					}
				}
				.updata_btn{
					height: 72rpx;
					color: #fff;
					font-size: 30rpx;
					@include flex_center;
					border-radius: 40rpx;
					margin: 20rpx auto 0;
					background-color: $tyj_mall_color;
				}
				
				//下载进度
				.downloads{
					margin-top: 30rpx;
					@include flex_cloumn_center;
					font-size: 24rpx;
					color: $ych_font_color;
					.task_links{
						display: flex;
						width: 100%;height: 15rpx;
						margin: 15rpx 0;
						border-radius: 15rpx;
						background-color: #999;
						overflow: hidden;
						.shows{
							background-color: $tyj_nav_color;
							border-radius: 15rpx;
						}
					}
				}
			}
			
		}
	}
</style>
